<template>
  <div>
    <el-header>
      <div id="home_header" height='50px'>
        <div class="left" style="float:left;">
          教学质量管理平台
        </div>
      </div>
    </el-header>
    <el-container :style="{'height': heightMax+'px', 'border':' 1px solid #eee'}">
      <el-aside width="200px" style="background-color: rgb(238, 241, 246)">
        <el-menu default-active="0" :style="{'height': heightMax-2+'px'}">
          <el-menu-item :index="indexli+''" v-for="(item,indexli) in evaluateList" :key=' indexli' router>
            <i class="el-icon-menu"></i>
            <span slot="title">{{item}}</span>
          </el-menu-item>
        </el-menu>
      </el-aside>

      <el-main>
        <router-view></router-view>
      </el-main>
    </el-container>

  </div>
</template>

<script>
  export default {
    data() {
      return {
        evaluateList: ['我的任务', '评价我的', '课堂发布任务'],
        heightMax: 0,
      }
    },
    created() {
      this.heightMax = window.innerHeight - 76;
    }
  }

</script>

<style>
  #home_header {
    height: 100%;

  }

  #home_header .left,
  .right {
    height: 100%;
    line-height: 50px !important;
  }

  .el-dropdown-link {
    cursor: pointer;
    color: #409EFF;
  }

  #home_header .left {
    color: #095eb4;
    font-size: 24px;
    font-weight: 900;
  }

  .cell {
    text-align: center !important;
  }

</style>
